<template>
    <div class="page-100 ">
        <div class="header-title">
            <p>联系方式</p>
        </div>
        <div style="background-color: white;height: 30%;border-bottom: 1px solid #e5e5e5;">
            <p class="left">发起人：{{name}}</p>
            <p class="left ">机构-部门：{{jigoubumen}}</p>
            <p class="left">联系电话：{{contactNumber}}</p>
            <p class="left">送货地址：{{addr}}</p>
        </div>
        <div class="header-title">采购明细</div>
        <div class="mui-flex" v-for="(item,index) in dataList">
            <div class="cell5" >
                <p class="left-title"> {{item.name}}</p>

            </div>
            <div class="cell">
                <p class="right-title"> {{item.amounts}}件</p>

            </div>
        </div>
        <div v-if="isshow">
            <div class="header-title">备注</div>
                <p class="remark" >{{remark}}</p>
        </div>
        <div style="background-color: #fafafa;height: 400px;padding-top: 20px" v-if="isshowButton">
            <yd-button size="large" type="primary" @click.native="confrimClick" style="background-color:#3cc8a8;color:white;height: 50px">{{buttonName}}</yd-button>

        </div>


    </div>
</template>

<script>
    import {voucherapplyDetails} from "../../pcof/post";


    import {userInfoData} from '../../globalVariables'

    export default {
        name: "voucherDetail",
        data() {
            return {
                isshow:true,
                buttonName:'',
                isshowButton:false,
                state:'',
                applicationUuid:'',
                name:'',
                jigoubumen:'',
                contactNumber:'',
                addr:'',
                dataList:[],
                remark:'',
                type:'',

            };
        },

        methods:{
            // confrimClick()
            // {
            //     console.log(this.state);
            //     if (this.state==='03')
            //     {
            //       //确认收货
            //         this.$router.replace({name: 'voucherShouhuonum', params: {applicationUuid: this.applicationUuid,dataAr:this.dataList,type:'2'}});
            //
            //
            //     }else if (this.state==='95')
            //     {
            //       //评价';
            //         this.$router.replace({name: 'customEvaluate', params: {type: '2',uuid: this.applicationUuid}});//type //1 是办公用品 2是凭证请领
            //
            //     }else
            //     {
            //         this.isshowButton=false;
            //
            //     }
            // }

        },
       async created()
        {
            this.applicationUuid = this.$route.params.applicationUuid;
            this.state=this.$route.params.state;
            console.log('状态'+this.state+'数据'+this.type);
            this.type=this.$route.params.type;

            //type 0是待办页 1是历史页来的(不显示button)
            //  ("00", "待审批"),("01", "审批中"),("02", "待配送"),("03", "配送中"),("85", "已撤销"),("90", "被拒绝"),("95", "待评价"),("99", "已完成");

            if (this.type === '0') {
                if (this.state==='03')
                {
                    this.buttonName='确认收货';
                    this.isshowButton=true;
                }else if (this.state==='95')
                {
                    this.buttonName='评价';
                    this.isshowButton=true;

                }else
                {
                    this.isshowButton=false;

                }
            }else
            {
                this.isshowButton=false;

            }

            var mobile = JSON.parse(localStorage.getItem(userInfoData)).mobile;
            console.log(this.applicationUuid);
            this.$dialog.loading.open('加载中...');

            var response = await voucherapplyDetails(mobile,this.applicationUuid);
            if (response.data.code === 200) {
                this.$dialog.loading.close();
                this.name=response.data.data.applierName;

                if (response.data.data.deptName === '' || response.data.data.deptName === null) {
                    this.jigoubumen=response.data.data.instName;

                } else {
                    this.jigoubumen=response.data.data.instName+response.data.data.deptName;

                }
                this.contactNumber=response.data.data.contactNumber;
                this.addr=response.data.data.addr+response.data.data.room;
                this.dataList=response.data.data.vouchers;
                if (response.data.data.remark === '' || response.data.data.remark === null) {
                    this.remark='';
                    this.isshow=false;

                } else {
                    this.remark=response.data.data.remark;
                    this.isshow=true;

                }

            }else
            {
                this.$dialog.loading.close();
                this.$dialog.toast({
                    mes: response.data.msg,
                    timeout: 1500
                });
            }
        }
    }
</script>

<style scoped>
    .header-title {
        color: #9a9a9a;
        font-size: 0.2rem;
        text-align: left;
        border-bottom: 1px solid #e5e5e5;
        padding-top: 0.25rem;
        padding-left: 0.3rem;
        padding-bottom: 0.15rem;
        background-color: #fafafa;

    }
    .left-title {
        padding-left: 20px;
        text-align: left;
        font-size: 0.25rem;
        color: #585858;
        margin-top: 20px;
        margin-bottom: 10px;

    }
    .right-title {
        text-align: left;
        font-size: 0.25rem;
        color: #585858;
        margin-top: 20px;
        margin-bottom: 10px;

    }

    .left {
        float: left;
        margin-right: 0.3em;
        padding-left: 0.3rem;
        text-align: left;
        font-size: 0.25rem;
        color: #585858;
        width: 90%;
        height: 20%;
        margin-top: 10px;

    }
    .remark
    {
        padding: 20px ;
        font-size: 0.25rem;
        text-align: left;
        color: #9a9a9a;
    }
</style>